<template>
	<view class="page">
		<view class="flex flex-direction flex-wrap align-stretch benben-position-layout flex detailsPaid_flex_0"
			:style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx'}">
			<view class='flex flex-wrap align-center justify-between detailsPaid_fd0_0'>
				<view class='flex flex-wrap align-center detailsPaid_fd0_0_c0' @tap.stop="handleJumpDiy"
					data-type="back" data-url="1">
					<text class='fu-iconfont2  detailsPaid_fd0_0_c0_c0'>&#xE794;</text>
				</view>
				<view class='flex flex-wrap align-center'>
					<text class='detailsPaid_fd0_0_c1_c0'>售后详情</text>
				</view>
				<view class='flex align-center justify-end detailsPaid_fd0_0_c2'>
				</view>
			</view>
		</view>
		<view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>
		<view class="loading_css" v-if="!isShow">
			<u-loading size="36" color="#4177DD"></u-loading>
			<view class="loading_text">加载中</view>
		</view>
		<view v-else>
			<!-- 进度 -->
			<view class="">
				<view class="fu-bgcred1">
					<image :src='STATIC_URL+"166.png"' mode="aspectFill" class="img"></image>
					<template v-if="afterInfo.status == -1 || afterInfo.status == 0 || afterInfo.status == 1 ||  afterInfo.status == 3">
						<block v-if="afterInfo.status >= 0">
							<uni-steps :options="steps" :active="speed" activeColor="#ffffff"
								deactiveColor="#ffffff"></uni-steps>
						</block>
					</template>
					
				</view>
			</view>
			<view class="margin-lr-24 radius-16 bg-white padding afterStatus" :class="(afterInfo.status < 0) || afterInfo.status == 2 ?'up':''" style="margin-bottom: 24rpx;">
				<view class="text-lg text-333 text-weight-600">
					<text v-if="afterInfo.status == -1">售后关闭</text>
					<text v-if="afterInfo.status == 2">审核失败</text>
				</view>
				<block v-if="afterInfo.status == 2">
					<view class="text-sm text-weight-500 text-666 margin-top-16 text-2f">{{afterInfo.reject_reason}}</view>
				</block>
				<block v-if="afterInfo.status == -1">
					<view class="text-sm text-weight-500 text-2f margin-top-10">
						撤销时间:{{ afterInfo.cancel_time }}</view>
					<view class="text-sm text-weight-500 text-666 margin-top-16">
						您已撤销本次退款申请，如有问题未解决，您可重新发起申请
					</view>
				</block>
				<!-- 退款 -->
				<!-- <block v-if="afterInfo.refund_type == 1">
					<view class="text-lg text-333 text-weight-600">
						<text v-if="afterInfo.status == 0">请等待商家处理</text>
						<text v-if="afterInfo.status == 3">售后已完成</text>
					</view>
					<block v-if="afterInfo.status == 0">
						<view class="text-sm text-weight-500 text-2f margin-top-10">
							您已成功发起退款申请，请耐心等待商家处理。
						</view>
						<view class="text-sm text-weight-500 text-666 margin-top-16">
							商家同意，系统将退款给您
						</view>
					</block>
				</block> -->
				<!-- 退货退款 -->
				<block>
					<view class="text-lg text-333 text-weight-600">
						<text v-if="afterInfo.status == 0">请等待商家处理</text>
						<text v-if="afterInfo.status == 1">请寄回商品</text>
						<!-- <text v-if="afterInfo.status == 2">请等待商家退款</text> -->
						<text v-if="afterInfo.status == 3">售后已完成</text>
					</view>
					<view class="text-sm text-weight-500 text-2f margin-top-10">
						<text v-if="afterInfo.status == 0">您已成功发起退款申请，请耐心等待商家处理。</text>
						<text v-if="afterInfo.status == 1">平台已同意退货申请，请寄回商品。</text>
						<!-- <text v-if="afterInfo.status == 2">商品已寄回，请等待商家收货并退款。</text> -->
					</view>
					<view class="text-sm text-weight-500 text-666 margin-top-16">
						<text v-if="afterInfo.status == 0">
							平台同意，系统将退款给您
							如平台拒绝，您可以修改申请后再次发起，平台会重新处理。
						</text>
						<text v-if="afterInfo.status == 1">
							未与商家协商一致，请勿使用到付或者平邮，以免商家拒收。
							如果商家收到货并验货无误，将操作退款给您。
						</text>
						<!-- <text v-if="afterInfo.status == 2"></text> -->
					</view>
					<view class="text-sm text-weight-500 text-666 margin-top-14">
						<text v-if="afterInfo.status == 1">钱款原路返回至您支付时选择的账户。</text>
						<!-- <text v-if="status == 2">商品已寄回，请等待商家收货并退款。</text> -->
					</view>
				</block>
				<!-- 换货 2021-6-18 换货没有设计图 -->
				<!-- <block v-if="afterInfo.refund_type == 3">
					<view class="text-lg text-333 text-weight-600">{{ statusStr }}</view>
					<view class="text-sm text-weight-500 text-2f margin-top-10">
						您已成功发起退款申请，请耐心等待商家处理。
					</view>
					<view class="text-sm text-weight-500 text-666 margin-top-16">
						商家同意，系统将退款给您
					</view>
				</block> -->
			</view>
			<!-- 寄回地址  -->
			<!-- <view class="padding-lr-24 posZindex" v-if="afterInfo.status == 1 || afterInfo.status == 2"
				style="margin-bottom: 24rpx;">
				<view class="radius-16 bg-white backAddress">
					<view class="comment-title">
						{{i18n['寄回地址']}}
					</view>
					<view class="list-item flex align-center">
						<view class="title">{{ i18n['收货人'] }}</view>
						<view class="text-sm text-333 text-weight-400">{{ afterInfo && afterInfo.receiver_name }}</view>
					</view>
					<view class="list-item flex align-center">
						<view class="title">{{ i18n['联系电话'] }}</view>
						<view class="text-sm text-333 text-weight-400">{{ afterInfo && afterInfo.receiver_mobile }}
						</view>
					</view>
					<view class="list-item flex">
						<view class="title">{{ i18n['退货地址'] }}</view>
						<view class="text-sm flex flex-direction text-333 text-weight-400">
							<text>{{ afterInfo && afterInfo.receiver_address }}</text>
							<text class="text-sm margin-top-10 text-2f"
								@click="copyInfo(afterInfo.receiver_address)">{{i18n['复制']}}</text>
						</view>
					</view>
					<view class="list-item">
						<text class="title">{{ i18n['快递名称'] }}</text>
						<text class="text-sm">{{ afterExp && afterExp.express_company_name }}</text>
					</view>
					<view class="list-item">
						<text class="title">{{ i18n['快递单号'] }}</text>
						<text class="text-sm">{{ afterExp && afterExp.express_no }}</text>
					</view>
				</view>
			</view> -->
			<!-- 退款信息 -->
			<view class="padding-lr-24 posZindex" v-if="afterInfo.status == 3">
				<view class="radius-16 bg-white backAddress">
					<view class="comment-title-1">
						商家已退款
					</view>
					<view class="list-item flex ">
						<view class="title">退款金额</view>
						<view class="text-sm text-333 text-weight-400">￥{{afterInfo.refund_price}}</view>
					</view>
					<view class="list-item flex">
						<view class="title">退款账户</view>
						<!-- <view class="text-sm text-333 text-weight-400">{{refund_account}}</view> -->
						<view class="text-sm text-333 text-weight-400">原路返回</view>
					</view>
					<view class="list-item flex">
						<view class="title">退款时间</view>
						<view class="text-sm flex flex-direction  text-333 text-weight-400">
							<text>{{afterInfo.refund_time}}</text>
						</view>
					</view>
				</view>
			</view>

			<!-- 商品信息 -->
			<view class="padding-lr-24 margin-top-sm posZindex">
				<view class="radius-16 bg-white padding">
					<view class="comment-title">
						退款信息
					</view>
					<view style="font-size: 28rpx;margin-bottom: 20rpx;">
						<text>订单编号：</text>
						<text>{{order_sn}}</text>
					</view>
					<view class="flex padding-bottom-sm solid-bottom" @click="navToDetail">
						<view class="block-200 margin-right-sm radius overHidden">
							<image :src="afterInfo.goods_thumb" mode="aspectFill"></image>
						</view>
						<view class="flex-sub flex flex-direction justify-between" style="width: 438rpx;">
							<view class="">
								<view class="text-df text-cut-2 text-333 text-weight-500">{{ afterInfo.goods_name }}
								</view>
								<view v-if="afterInfo.sku_name"
									class="text-sm text-cut margin-top-8 text-999 text-weight-400">
									{{ afterInfo.sku_name }}
								</view>
								<!-- <view  class="text-sm text-cut margin-top-8 text-999 text-weight-400">提亮，抗初老</view> -->
							</view>
							<view class="flex justify-between">
								<text class="text-sm">
									<!-- <text class="text-999 margin-right-xs">{{ i18n['实际支付'] }}:</text> -->
									<text
										class="text-bold text-lg text-price text-red">{{ afterInfo.shop_price }}</text>
								</text>
								<text class="text-sm margin-left">
									<!-- <text class="text-999 margin-right-xs">{{ i18n['申请数量'] }}:</text> -->
									<text class="text-weight-400 text-999">x{{ afterInfo.num }}</text>
								</text>
							</view>
						</view>
					</view>
					<view class="list-item padding-top-sm">
						<text class="title">服务类型</text>
						<!-- <text class="text-sm">{{ afterInfo && afterInfo.refund_type_title }}</text> -->
						<text class="text-sm">退款退货</text>
					</view>
					<!-- <view class="list-item">
						<text class="title">退款金额</text>
						<text class="text-sm text-price">{{ afterInfo && afterInfo.refund_money }}</text>
					</view> -->
					<view class="list-item flex">
						<text class="title">退款原因</text>
						<text class="text-sm word-break-all">{{ afterInfo && afterInfo.refund_reason }}</text>
					</view>
					<view class="list-item">
						<text class="title">申请时间</text>
						<text class="text-sm">{{ afterInfo && afterInfo.create_time }}</text>
					</view>
					<view class="list-item ">
						<text class="title">退款编号</text>
						<text class="text-sm">{{ afterInfo && afterInfo.refund_order_sn }}</text>
						<text class="text-sm text-3f margin-left" @click="copyInfo(afterInfo.refund_order_sn)">复制</text>
					</view>
					<view class="list-item flex align-start" v-if="afterInfo && afterInfo.refund_image.length != 0">
						<view class="title">退款凭证</view>
						<view class="flex">
							<view class="img-wrap" v-for="(item, index) in afterInfo.refund_image" :key="index"
								@click="previewImage(index)">
								<image :src="item" mode="aspectFill"></image>
							</view>
						</view>
					</view>
					<!-- <view class="list-item "
						v-if="(afterInfo.refund_type == '2' || afterInfo.refund_type == '3') && afterInfo.express_no">
						<text class="title">物流单号</text>
						<text class="text-sm">{{afterInfo.express_no}}</text>
					</view> -->
				</view>
			</view>
		</view>

		<!-- <view class="padding-lr margin-top-sm" v-if="imgs.length != 0">
			<view class="radius-16 bg-white padding">
				<view class="text-bold text-333 text-df">{{ i18n['退款凭证照片'] }}</view>
				<view class="margin-top-sm flex flex-wrap">
					<view class="block-200 margin-right-sm margin-top-sm" v-for="(item, index) in imgs" :key="index"
						@click="previewImage(index)">
						<image class="radius" :src="item" mode="aspectFill"></image>
					</view>
				</view>
			</view>
		</view> -->
		<!-- 退货订单的物流信息 start -->
		<!-- <view v-if="physical.length > 0" class="fu-back-acrgo">
			<view class="cu-timeline margin-top-sm padding-left-sm fu-back-acrgo">
				<view class="cu-time">{{ i18n['物流信息'] }}</view>
				<view class="cu-item text-blue" v-for="(item, index) in physical" :key="index">
					<view class="">{{ item.AcceptTime }}</view>
					<view class=" content">
						<text>{{ item.AcceptStation }}</text>
					</view>
				</view>
			</view>
		</view> -->
		<!-- 退货订单的物流信息 end -->
		<view class="solid-top bottom-action flex justify-between align-center">
			<view class="kefu" @tap="toCustomer()">
				<image :src='STATIC_URL+"167.png"' mode="aspectFill" class="img"></image>
				<text>联系平台</text>
			</view>
			<view>
				<button v-if="afterInfo.status == 0 || afterInfo.status == 1"
					class="cu-btn line-black round sm text-white add" @click="cancelAfter">撤销申请</button>
				<button style="margin-left: 24rpx;" v-if="afterInfo.status == 0 || afterInfo.status == 2" class="cu-btn line-black round sm text-white add" @click="toAftermarket()">修改申请</button>
				<!-- <button
					v-if="(afterInfo.status == 0 || afterInfo.status == 1) && afterInfo.refund_type == '2' && !afterInfo.express_no" class="cu-btn line-black round sm text-white add" @click="cancelAfter">修改申请</button> -->
				<!-- <button
					v-if="afterInfo.status == 1 && (afterInfo.refund_type == '2' || afterInfo.refund_type == '3') && !afterInfo.express_no"
					class="cu-btn line-black round sm text-white margin-left-sm add" @click="sendLog">
					寄回商品
				</button>
				<button
					v-if="(afterInfo.status == 1 && afterInfo.express_no) || afterInfo.status == 2 && (afterInfo.refund_type == '2' || afterInfo.refund_type == '3') "
					class="cu-btn line-black round sm text-white margin-left-sm add" @click="lookLog">
					查看物流
				</button> -->
				<button v-if="afterInfo.status == 3 || afterInfo.status == 2 || afterInfo.status == -1"
					class="cu-btn line-black round sm text-white margin-left-sm add" @click="delOrder">
					删除订单
				</button>
				<!-- <button class="cu-btn margin-tb-sm round line-theme margin-left-sm sm" @tap="toCustomer()">{{ i18n['联系客服'] }}</button> -->
			</view>
		</view>
		<view style="height: 130rpx;"></view>
		
		<view class="back-success-wrap" v-if="backSuccessShow">
			<view class="mask" @click="backSuccessShow = false">
			</view>
			<view class="back-content flex flex-direction justify-between align-center">
				<view class="back-content-info bg-white flex flex-direction justify-between align-center">
					<view class="text-weight-500 text-xl" style="margin-bottom: 24rpx;">系统提示</view>
					<view>
						<image style="width: 195rpx;height: 140rpx;" :src='STATIC_URL+"104.png"' mode="aspectFill"></image>
					</view>
					<view class="back-success text-333 text-df text-weight-500">
						撤销申请成功
					</view>
				</view>
				<view class="cuIcon-roundclose text-white text-xxl  text-62" @click="backSuccessShow = false">

				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				initSteps: false,
				imgWechatUrl: this.imgWechatUrl,
				id: null,
				steps: [{
						title: '提交申请'
					},
					{
						title: '商家审核'
					},
					{
						title: '商家收货'
					},
					{
						title: '退款'
					},
					{
						title: '完成'
					}
				],
				speed: 0,
				afterExp: {
					express_no: 0
				},
				status: 0,
				statusStr: '',
				goods_id: 0,
				sku_id: 0,
				physical: [], // {Array} 换货订单物流信息
				backSuccessShow: false,
				updata_time: 0, //撤销时间
				refund_time: 0, //退款时间
				refund_money: 0, //退款金额
				refund_account: '', //退款账户
				order_sn: '',
				afterInfo: {}, // 售后订单详情信息
				goodsInfo: {}, // 退款商品信息
				itemIndex: '', // 列表订单索引
				index: '',
				isShow: false,
				order_sn: "",
				goods_id: "",
			};
		},
		computed: {
			refundInfoShow() {
				let flag = false;
				// 不能不判断，后续可能会有换货，换货现在没有原型图，不太清楚流程
				if (this.afterInfo.refund_type == 1 || this.afterInfo.refund_type == 2) {
					if (this.status == 3) {
						flag = true;
					}
				}
				return flag;
			}
		},
		onShow() {
			setTimeout(() => {
				this.getData();
			}, 200);
		},
		onLoad(options) {
			const {
				order_sn,
				goods_id
			} = options;
			this.order_sn = order_sn;
			this.goods_id = goods_id;
		},
		methods: {
			// 发起售后
			toAftermarket() {
				uni.navigateTo({
					url: '/pages/wode/customer/customer?order_sn=' + this.order_sn + '&goods_id=' + this.goods_id
				})
				// console.log(item)
				// this.$urouter.navigateTo({
				// 	url: '/pages/order/afterorder/afterorder-apply/index',
				// 	params: {
				// 		sku_id: item.sku_id,
				// 		order_sn: item.order_sn,
				// 		goods_id: item.goods_id,
				// 		status: item.status,
				// 		index: this.index,
				// 		order_type: item.order_type,
				// 		back: 2
				// 	}
				// });
			},
			/**
			 * 删除订单
			 */
			delOrder() {
				let that = this;
				this.$util.showModal({
					title: '提示',
					content: '确认删除订单吗？',
					success: function(res) {
						if (res.confirm) {
							that.$api.post(global.apiUrls.post66038b6f42821, {
								order_sn: that.order_sn,
								goods_id: that.goods_id
							}).then(result => {
								if (result.data.code == 1) {
									that.$message.info('删除成功');
									setTimeout(() => {
										uni.navigateBack();
									}, 800);
								} else {
									that.$message.info(result.data.msg);
								}
							}).catch(err => {
								console.log(err);
							});
						}
					}
				})
			},
			/**
			 * 查看物流
			 */
			lookLog() {
				uni.navigateTo({
					url: '/pages/order/orderdetail/express-delivery/index?server_no=' + this.afterInfo.server_no
				})
			},
			/**
			 * @description copy复制
			 * @param {String} data 数据
			 */
			copyInfo(data) {
				let that = this;
				uni.setClipboardData({
					data,
					success: function() {
						that.$message.info('复制成功');
						// console.log('success');
					}
				});
			},
			/**
			 * @description 退货查询物流新信息
			 */
			getingPhysical() {
				this.$api
					.post(global.apiUrls.postOrderLogs, {
						order_sn: this.afterInfo.order_sn,
						server_no: this.afterInfo.server_no
					})
					.then(res => {
						console.log('物流信息', res.data);
						if (res.data.code == 1) {
							this.express_name = res.data.data.ShipperCode;
							this.express_no = res.data.data.OrderCode || 0;
							this.physical = res.data.data.Traces.reverse();
						} else {}
					});
			},
			// 预览图片
			previewImage(index) {
				uni.previewImage({
					urls: this.afterInfo.refund_image,
					current: index
				});
			},
			//联系客服
			toCustomer() {
				uni.navigateTo({
					url: '/pages/homepage/platformCustomerService/platformCustomerService'
				})
				return
				// 基础版本不需要此客服，暂时屏蔽
				this.$urouter.navigateTo({
					url: '/pages/service-message/service/service-detail/index',
					params: {
						kid: 1,
						goods_id: this.goods_id,
						activity_id: this.activity_id || 0
					}
				});
			},
			// 去详情页
			navToDetail() {
				this.$urouter.navigateTo({
					url: '/pages/goods/goodsdetail/goods-detail/index',
					params: {
						goods_id: this.afterInfo.goods_id,
						sku_id: this.afterInfo.sku_id
					}
				});
			},
			// 取消售后
			cancelAfter() {
				let that = this;
				this.$util.showModal({
					title: '提示',
					content: '确认撤销申请吗？',
					success: (res) => {
						if (res.confirm) {
							that.$api.post(global.apiUrls.post66038b8a674bb, {
								order_sn: that.order_sn,
								goods_id: that.goods_id
							}).then(res => {
								if (res.data.code == 1) {
									this.backSuccessShow = true;
									that.getData();
								} else {
									this.$message.info(res.data.msg);
								}
							}).catch(err => {
								this.$message.info('服务器错误，请稍后重试');
							});
						}
					}
				})

			},
			// 提交物流信息
			sendLog() {
				this.$urouter.navigateTo({
					url: '/pages/order/afterorder/afterorder-sendback/index',
					params: {
						id: this.id,
						goods: JSON.stringify(this.goodsInfo)
					}
				});
			},
			//
			getData() {
				let that = this;
				that.$api
					.post(global.apiUrls.post66037f517f1a1, {
						order_sn: that.order_sn,
						goods_id: that.goods_id
					})
					.then(res => {
						// console.log(res);
						this.isShow = true;
						if (res.data.code == 1) {
							let data = res.data.data;
							this.afterInfo = res.data.data;
							this.goodsInfo = {
								goods_name: this.afterInfo.goods_name,
								goods_thumb: this.afterInfo.goods_thumb,
								num: this.afterInfo.num,
								sku_name: this.afterInfo.sku_name,
								sku_id: this.afterInfo.sku_id,
								refund_money: this.afterInfo.refund_money
							}
							that.steps = [{
									title: '提交申请'
								},
								{
									title: '商家审核'
								},
								{
									title: '退款完成'
								}
							];
							// if (that.afterInfo.refund_type == '1') {
							// 	that.steps = [{
							// 			title: '提交申请'
							// 		},
							// 		{
							// 			title: '商家审核'
							// 		},
							// 		{
							// 			title: '退款完成'
							// 		}
							// 	];
							// } else if (that.afterInfo.refund_type == '2') {
							// 	that.steps = [{
							// 			title: '提交申请'
							// 		},
							// 		{
							// 			title: '商家审核'
							// 		},
							// 		{
							// 			title: '寄回商品'
							// 		},
							// 		{
							// 			title: '退款完成'
							// 		}
							// 	];
							// } else if (that.afterInfo.refund_type == '3') {
							// 	that.steps = [{
							// 			title: '提交申请'
							// 		},
							// 		{
							// 			title: '商家审核'
							// 		},
							// 		{
							// 			title: '商家收货'
							// 		},
							// 		{
							// 			title: '换货'
							// 		},
							// 		{
							// 			title: '完成'
							// 		}
							// 	];
							// }
							this.refund_money = data.refund_money;
							this.refund_time = data.refund_time;
							this.refund_account = data.refund_account || '';
							that.filterStatus(data.status);
						}
					})
					.catch(err => {
						console.log(err);
					});
			},
			/**
			 * @description 步骤器当前步数  -2售后取消 -1商家驳回 0等待商家处理 1商家同意 2商家已收货 3退款 4商家已发货
			 */
			filterStatus(status) {
				console.log('步骤器==>', status);
				let that = this;
				switch (Number(status)) {
					case -2:
						// that.statusStr = global.i18n['售后关闭'];
						that.speed = 1;
						break;
					case -1:
						// that.statusStr = global.i18n['商家已驳回,如有疑问请联系商家客服'];
						// that.steps = [
						//   {
						//     title: global.i18n['提交申请']
						//   },
						//   {
						//     title: global.i18n['商家驳回']
						//   }
						// ];
						that.speed = 1;
						break;
					case 0:
						that.statusStr = '请等待商家处理';
						that.speed = 0;
						break;
					case 1:
						if (that.afterInfo.refund_type == '1') {
							// that.statusStr = global.i18n['商家已同意您的售后申请,将在(1-3)工作日内退款'];
						} else {
							// that.statusStr = global.i18n['商家已同意您的售后申请,请尽快寄回商品'];
						}
						that.speed = 1;
						if (that.afterInfo.express_no) that.speed = 2;
						break;
					case 2:
						// that.statusStr = global.i18n['商家已收货,将在(1-3)工作日处理'];
						that.speed = 2;
						break;
					case 3:
						if (that.afterInfo.refund_type == 1) {
							that.speed = 3;
						}
						that.statusStr = '售后已完成';
						that.speed = 4;
						break;
					case 4:
						if (that.afterInfo.refund_type == '3') {
							that.speed = 3;
						}
						// that.statusStr = global.i18n['商家已发货,感谢您对本平台的支持'];
						break;
				}
			},
			motifyAfter(item) {
				this.$urouter.navigateTo({
					url: '/pages/order/afterorder/afterorder-apply/index',
					params: {
						sku_id: item.sku_id,
						order_sn: item.order_sn,
						goods_id: item.goods_id,
						status: item.status,
						index: this.index,
						order_type: item.order_type,
						back: 2,
						server_no: item.server_no,
					}
				});
			}
		}
	};
</script>

<style lang="scss" scoped>
	.page {
		width: 100vw;
		overflow-x: hidden;
		min-height: calc(100vh - var(--window-bottom));
		// background: url(~@/static/images/36.png) no-repeat, #F8F8F8;
		background-size: 100% auto !important;
	}

	.detailsPaid_flex_0 {
		// background: url(~@/static/images/36.png) no-repeat, transparent;
		width: 750rpx;
		height: 88rpx;
		overflow: hidden;
		z-index: 99;
		top: 0rpx;
		background-size: 100% auto !important;
		background: #ffffff;
	}

	.detailsPaid_fd0_0_c2 {
		padding: 0rpx 0rpx 0rpx 0rpx;
		width: 200rpx;
	}

	.detailsPaid_fd0_0_c1_c0 {
		font-size: 36rpx;
		font-weight: 500;
		color: #333;
	}

	.detailsPaid_fd0_0_c0_c0 {
		font-size: 36rpx;
		color: #333;
		font-weight: 500;
	}

	.detailsPaid_fd0_0_c0 {
		width: 200rpx;
	}

	.detailsPaid_fd0_0 {
		padding: 0rpx 32rpx 0rpx 32rpx;
		line-height: 88rpx;
	}

	.text-2f {
		color: #FB9217;
	}

	.text-3f {
		color: #2F98FE;
	}

	.margin-top-8 {
		margin-top: 8rpx;
	}

	.margin-top-10 {
		margin-top: 10rpx;
	}

	.margin-top-16 {
		margin-top: 16rpx;
	}

	.margin-top-14 {
		margin-top: 14rpx;
	}

	.padding-lr-24 {
		padding: 0 24rpx;
	}

	.margin-lr-24 {
		margin: 0 24rpx;
	}

	.img-wrap {
		width: 160rpx;
		height: 160rpx;
		margin-right: 10rpx;

		image {
			width: 100%;
			height: 100%;
			border-radius: 8rpx;
		}
	}

	.backAddress {
		padding: 32rpx 24rpx;
	}

	.text-4d {
		color: #4DC777;
	}

	.fu-bgcred1 {
		width: 100%;
		height: 240rpx;
		padding-top: 48rpx;
		position: relative;

		.img {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 240rpx;

		}
	}

	.block-200 {
		width: 200rpx;
		min-width: 200rpx;
		height: 200rpx;
		min-height: 200rpx;
		border-radius: 16rpx;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.radius-16 {
		border-radius: 16rpx;
	}

	.add {
		// background: $bgtheme !important;
		// color: $uni-text-color-inverse;
		width: 170rpx;
		height: 60rpx;
		line-height: 60rpx;
		background: #f9f9f9;
		border-radius: 50px;
		font-size: 24rpx;
		color: #333333;
		font-weight: 400;
		text-align: center;
		border: none;
	}

	.cu-btn[class*="line"]::after {
		border: none;
	}

	.list-item {
		word-break: break-all;

		.title {
			display: inline-block;
			width: calc(4em + 40rpx);
			font-size: 24rpx;
			color: #999999;
			font-weight: 400;
			flex-shrink: 0;
		}
	}

	.list-item+.list-item {
		margin-top: 32rpx;
	}

	.bottom-action {
		width: 100%;
		padding: 0 32rpx;
		background-color: #ffffff;
		height: 100rpx;
		height: calc(100rpx + constant(safe-area-inset-bottom));
		height: calc(100rpx + env(safe-area-inset-bottom));
		padding-bottom: 0;
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		display: flex;
		align-items: center;
		z-index: 99;
	}

	.word-break-all {
		word-break: break-all;
	}

	// 换货 start
	.fu-back-acrgo {
		padding: 0 32rpx 0 32rpx;
		overflow: hidden;
		border-radius: 20rpx;

		.cu-timeline>.cu-item {
			padding: 30rpx 30rpx 30rpx 68rpx;
		}

		.cu-timeline>.cu-item::before {
			left: 0;
		}

		.cu-timeline>.cu-item::after {
			left: 24rpx;
		}
	}

	// 换货 end
	.uni-steps {
		position: relative;
		z-index: 11;
	}

	.comment-title-1 {
		font-size: 32rpx;
		font-weight: 500;
		color: #333333;
		padding-bottom: 24rpx;
		margin-bottom: 24rpx;
		position: relative;

		&::before {
			content: '';
			width: 100%;
			height: 1px;
			background: #EEEEEE;
			transform: scaleY(0.5);
			position: absolute;
			left: 0;
			bottom: 0;
		}
	}

	.comment-title {
		font-size: 32rpx;
		font-weight: 500;
		color: #333333;
		padding-bottom: 24rpx;
		margin-bottom: 24rpx;
		text-indent: 22rpx;
		position: relative;

		&::before {
			content: '';
			width: 100%;
			height: 1px;
			background: #EEEEEE;
			transform: scaleY(0.5);
			position: absolute;
			left: 0;
			bottom: 0;
		}

		&::after {
			content: '';
			width: 6rpx;
			height: 30rpx;
			border-radius: 4rpx;
			background: #3083FF;
			;
			position: absolute;
			left: 0;
			top: 8rpx;

		}
	}

	.kefu {
		font-size: 24rpx;
		.img {
			display: inline-block;
			vertical-align: middle;
			overflow: hidden;
			width: 32rpx;
			height: 32rpx;
			margin-right: 10rpx;
			margin-top: -4rpx;
		}
	}

	.back-success-wrap {
		.mask {
			position: fixed;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			z-index: 99;
			background: rgba(0, 0, 0, 0.6);
		}

		.back-content {
			position: fixed;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			z-index: 100;
			width: 540rpx;

			// height: 424rpx;
			.back-content-info {
				border-radius: 25rpx;
				width: 540rpx;
				height: 370rpx;
				padding: 36rpx 0;

				.text {
					font-size: 150rpx;
				}
			}
		}
	}

	.text-62 {
		font-size: 60rpx;
		margin-top: 48rpx;
	}

	.afterStatus {
		position: relative;
		z-index: 11;
		margin-top: -30rpx;

		&.up {
			margin-top: -180rpx;
		}
	}

	.posZindex {
		position: relative;
		z-index: 11;
	}
</style>